layui.config({
    base: CXL.ctxPath + '/externaljs/'
}).extend({ //设定组件别名
    echarts: 'echarts/echarts',
    axios: 'axios/axios'
});
layui.use([ 'table', 'laydate', 'echarts'], function () {
    var admin = layui.admin;
    var table = layui.table;
    var laydate = layui.laydate;
    var $ = layui.$;

    /**
     * 表格参数
     */
    var Page = {
        tableId: 'roller-table',
        url: CXL.ctxPath + '/task/datagrid',
        initColumn: function () {
            return [[
                {type: 'numbers'}
                /*, {field: 'id', title: '任务id', width: 110}*/
                , {field: 'taskStatus', title: '任务状态', width: 90}
                , {field: 'steelNos', title: '钢板号', width: 125}
                , {
                    field: 'type', title: '任务类型', width: 100, templet: function (d) {
                        if (d.type == "offline") {
                            res = "下线"
                        } else if (d.type == "online") {
                            res = "上线"
                        }else if (d.type == "splitFlow") {
                            res = "分流"
                        } else {
                            res = "移动"
                        }
                        return res;
                    }
                }
                , {field: 'beginX', title: '起始位置x', width: 100}
                , {field: 'beginY', title: '起始位置y', width: 100}
                , {field: 'beginZ', title: '起始位置z', width: 100}
                , {field: 'endX', title: '结束位置x', width: 100}
                , {field: 'endY', title: '结束位置y', width: 100}
                , {field: 'endZ', title: '结束位置z', width: 100}
                , {
                    field: 'beginTime',
                    title: '开始时间',
                    width: 160,
                    templet: '<div>{{ layui.laytpl.toDateString(d.beginTime) }}</div>'
                }
                , {
                    field: 'endTime',
                    title: '结束时间',
                    width: 160,
                    templet: '<div>{{ layui.laytpl.toDateString(d.endTime) }}</div>'
                }
                , {
                    field: 'rollerId', title: '辊道', width: 100, templet: function (d) {
                        if (d.rollerId == 1) {
                            res = "辊道1"
                        } else if (d.rollerId ==2) {
                            res = "辊道2"
                        }
                        return res;
                    }
                }
                , {
                    field: 'stockId', title: '垛位(辊道)', width: 100, templet: function (d) {
                        if (d.stockId == 1) {
                            res = "垛位1"
                        } else if (d.stockId ==2) {
                            res = "垛位2"
                        }
                        return res;
                    }
                }
                , {field: 'rowNum', title: '行数量', width: 80}
                , {field: 'columnNum', title: '列数量', width: 80}
            ]];
        },
        page: true,
        addUrl: CXL.ctxPath + "/task/add",
        deleteUrl: CXL.ctxPath + "/task/delete"

    };

    /**
     * 页面查询
     */
    Page.searchAction = function () {
        var queryData = {};
        //查询字段
        queryData['type'] = $("#tasktypeinput").val();
        queryData['craneType'] = $("#craneidinput").val();

        queryData['beginTime_begin'] = $("#timeBegin").val();
        queryData['beginTime_end'] = $("#timeEnd").val();

        table.reload(Page.tableId, {where: queryData});
    }


    /**
     * 页面查询条件的重置
     */
    Page.resetAction = function () {
        $(".layui-input").val('');
        Page.searchAction();
    }


    /**
     * 表格的单击事件
     */
    Page.clickAction = function (obj) {

    }

    /**
     * 表格的双击事件
     */
    Page.doubleClickAction = function (obj) {

    }


    /**
     * 新增
     */
    Page.openAdd = function () {
        layer.open({
            type: 2,
            title: '新增',
            shadeClose: true,
            shade: 0.8,
            area: ['700px', '700px'],
            content: Page.addUrl,
            btn: ['确定', '取消'],
            yes: function (index, layero) {
                //点击确认触发 iframe 内容中的按钮提交
                var submit = layero.find('iframe').contents().find("#form-btn-save");
                submit.click();

                //刷新表格
                Page.searchAction();
            }
        });
    };

    /**
     * 编辑
     */
    Page.openEdit = function (data) {
        layer.open({
            type: 2,
            title: '编辑',
            shadeClose: true,
            shade: 0.8,
            area: ['700px', '700px'],
            content: Page.addUrl + "?id=" + data.ID,
            btn: ['确定', '取消'],
            yes: function (index, layero) {
                //点击确认触发 iframe 内容中的按钮提交
                var submit = layero.find('iframe').contents().find("#form-btn-save");
                submit.click();

                //刷新表格
                Page.searchAction();
            }
        });
    };

    /**
     * 查看
     */
    Page.openDetail = function (obj) {
        // let selectData = data.data;
        var layer = layui.layer;
        console.log(obj.id);
        layer.open({
            type: 1,
            content: $('#openShowBox'),
            area: ['700px', '800px'], //宽高
            btn: ["确定"],
            success: function (index, layero) {

                table.render({
                    elem: '#openShowTaskDetails'
                    // , height: 'full-140'
                    // , width: 'full-140'
                    // , page: true
                    , limit: 10
                    , autoSort: false
                    , url: CXL.ctxPath + "/taskApart/datagrid" + "?taskId=" + obj.id
                    , page: true
                    , cols: [[ //表头
                        {field: 'id', title: '任务id', width: 110}
                        , {field: 'craneType', title: '天车编号', width: 110}
                        , {field: 'steelNum', title: '钢板编号', width: 120}
                        , {
                            field: 'type', title: '任务类型', width: 100, templet: function (d) {
                                if (d.type == "suck") {
                                    res = "抓板"
                                } else if (d.type == "place") {
                                    res = "放板"
                                } else {
                                    res = d.type
                                }
                                return res;
                            }
                        }
                        , {field: 'beginX', title: '起始位置x', width: 100}
                        , {field: 'beginY', title: '起始位置y', width: 100}
                        , {field: 'beginZ', title: '起始位置z', width: 100}
                        , {field: 'endX', title: '结束位置x', width: 100}
                        , {field: 'endY', title: '结束位置y', width: 100}
                        , {field: 'endZ', title: '结束位置z', width: 100}
                        , {
                            field: 'beginTime',
                            title: '开始时间',
                            width: 170,
                            templet: '<div>{{ layui.laytpl.toDateString(d.beginTime) }}</div>'
                        }
                        , {
                            field: 'endTime',
                            title: '结束时间',
                            width: 170,
                            templet: '<div>{{ layui.laytpl.toDateString(d.endTime) }}</div>'
                        }
                    ]]
                });

            }
        });
    }

    /**
     * 删除表格数据
     */
    Page.deleteAction = function (obj) {
        parent.layer.confirm('真的确定要删除么', function (index) {

            //提交 Ajax进行后端删除
            $.ajax({
                type: "post",
                url: Page.deleteUrl,
                data: {id: obj.data.ID},
                success: function (res) {
                    if (res.success) {
                        CXL.success(res.msg);
                        //表格删除
                        obj.del();
                    } else {
                        CXL.warn(res.msg);
                    }
                }
            });

            layer.close(index);
        });
    }


    /**
     * 表格渲染
     */
    table.render({
        elem: '#' + Page.tableId
        , url: Page.url
        , height: 'full-140'
        , page: true
        , limit: 30
        , autoSort: false
        , toolbar: Page.toolbar
        , where: Page.where
        , defaultToolbar: []

        , cols: Page.initColumn()
    });

    /**
     * 表头工具栏
     */
    table.on('toolbar(' + Page.tableId + ')', function (obj) {
        var checkStatus = table.checkStatus(obj.config.id);
        switch (obj.event) {
            case 'doAdd':
                Page.openAdd();
                break;
        }
        ;
    });

    /**
     * 监听表格工具事件
     */
    table.on('tool(' + Page.tableId + ')', function (obj) {
        //获得当前行数据
        var data = obj.data;
        //获得 lay-event 对应的值（也可以是表头的 event 参数对应的值）
        var layEvent = obj.event;

        //查看操作
        if (layEvent === 'detail') {
            Page.openDetail(data);
        }
        //删除操作
        else if (layEvent === 'del') {
            Page.deleteAction(obj);
        }
        //编辑操作
        else if (layEvent === 'edit') {
            Page.openEdit(data);
        }
    });


    /**
     * 搜索按钮事件
     */
    $('#btnSearch').click(function () {
        Page.searchAction();
    });

    /**
     * 搜索按钮事件
     */
    $('#btnReset').click(function () {
        Page.resetAction();
    });

    //监听行单击事件
    table.on('row(' + Page.tableId + ')', function (obj) {
        Page.clickAction(obj);
    });

    //监听行双击事件
    table.on('rowDouble(' + Page.tableId + ')', function (obj) {
        Page.doubleClickAction(obj);
    });

    /**
     * 时间选择器渲染
     * 开始时间
     */
    laydate.render({
        elem: '#timeBegin' //指定元素
        , type: 'datetime'
        , value: new Date(new Date().getTime() - 8 * 60 * 60 * 1000)
    });

    /**
     * 时间选择器渲染
     * 结束时间
     */
    laydate.render({
        elem: '#timeEnd' //指定元素
        , type: 'datetime'
        , value: new Date()
    });

});


